<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>

</body>
<script>
  //   2. 数组去重
  // 有一个数组 var arr = [1, 2, 3, 3, 2, 1, 3, 1, 2, 1, 3, 2]  去除数组中的重复项=> [1, 2, 3]
  // var arr = [1, 2, 3, 3, 2, 1, 3, 1, 2, 1, 3, 2];
  // console.log(arr);
  // var newArr = [];
  // for (i = 0; i < arr.length; i++) {
  //   if (newArr.indexOf(arr[i]) == -1) {
  //     console.log(newArr);
  //     newArr.push(arr[i]);
  //   }
  // }
  // console.log(newArr);


  // 1. 删除去重

  var arr = [1, 2, 3, 3, 2, 1, 3, 1, 2, 1, 3, 2];

  //         0  1  2  3  4  5  6  7  8
  // var arr = [1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1];

  // 问题: 由于数组坍塌的原因 导致元素在删除时存在漏网之鱼,最终出现少删的情况
  // for (var i = 0; i < arr.length - 1; i++) {
  //     for (var j = i + 1; j < arr.length; j++) {
  //         if (arr[j] === arr[i]) {
  //             arr.splice(j, 1);
  //         }
  //     }
  // }
  // console.log(arr);

  // 怎么解决?
  // 1.  j--    删除之后 下次还是判断当前下标是否重复
  // for (var i = 0; i < arr.length - 1; i++) {
  //     for (var j = i + 1; j < arr.length; j++) {
  //         if (arr[j] === arr[i]) {
  //             arr.splice(j, 1);
  //             j--;   //删除之后 下次还是判断当前下标是否重复
  //         }
  //     }
  // }
  // console.log(arr);

  // 2. 倒着删
  // for (var i = 0; i < arr.length - 1; i++) {
  //     for (var j = arr.length-1; j>= i + 1; j--) {
  //         if (arr[j] === arr[i]) {
  //             arr.splice(j, 1);
  //         }
  //     }
  // }
  // console.log(arr);

  // 3. 新建数组去重?  => 遍历原数组 判断每隔元素在新数组中是否存在? 不存在 就放一个 存在就略过
  var arr = [1, 2, 3, 3, 2, 1, 3, 1, 2, 1, 3, 2];
  var uniArr = [];

  for (var i = 0; i < arr.length; i++) {
    var item = arr[i];
    if (uniArr.indexOf(item) == -1) {
      uniArr.push(item);
    }
  }
  console.log(uniArr);
</script>

</html>